<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <style>
        img {
            width: 100px;
            height: 200px;
            display: block;
        }
    </style>
    <button>猜猜我是谁</button>
    <script>
        let imgUrls = [
            "https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp8.itc.cn%2Fq_70%2Fimages03%2F20200623%2Ffe5ea35bbc6a4c6aa53359104a347e51.jpeg&refer=http%3A%2F%2Fp8.itc.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1654958065&t=fe45e54033ee7905468b8db13173578d",
            "https://img2.baidu.com/it/u=122642494,950399823&fm=253&fmt=auto&app=138&f=JPEG?w=600&h=450",
            "https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fwx1.sinaimg.cn%2Fmw1024%2F006Dannlly4h22cophqu1j30xc0m842k.jpg&refer=http%3A%2F%2Fwx1.sinaimg.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1654958181&t=cd70d67c7e2dd197e8762a9994905ad8",
        ];
        let btn = document.querySelector('button');
        let imgs = [];

        function preload(arr) {
            for (let i = 0; i < arr.length; i++) {
                // 加载多少 创建多少img节点 预加载
                imgs[i] = new Image();
                imgs[i].src = arr[i];
            }
        }

        window.onload = preload(imgUrls);
        btn.addEventListener('click', () => {
            // let img = new Image();
            // img.src = ' https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fss2.meipian.me%2Fusers%2F2404428%2Fb6c0da0b69a8457e88f9d9a35352e823.jpeg%3Fmeipian-raw%2Fbucket%2Fivwen%2Fkey%2FdXNlcnMvMjQwNDQyOC9iNmMwZGEwYjY5YTg0NTdlODhmOWQ5YTM1MzUyZTgyMy5qcGVn%2Fsign%2Fcd9f4d859da0e978de87633bf5f60860.jpg&refer=http%3A%2F%2Fss2.meipian.me&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1654958065&t=7894d68f898f2255d43df9d0b89ba0f5';
            // document.body.append(img)
            document.body.append(imgs[1]);

        })
    </script>
</body>

</html>